﻿/*表格显示效果
共有两种使用方式:
1.实例方法可以指定具体的table;
2.静态方法在页面的所有table上产生效果
xieran 20100922
*/
(function ($) {
    /*1.此"实例"方法可以指定某(些)table产生效果*/
    $.fn.effectRow = function (options) {
        var opts = $.extend({}, $.fn.effectRow.defaults, options);

        this.each(function () {
            var thisTable = $(this);
            //添加奇偶行颜色 
            $(thisTable).find('tr:odd > td').css('backgroundColor', opts.oddColor);
            $(thisTable).find('tr:even > td').css('backgroundColor', opts.evenColor);
            //添加活动行颜色 
            var originalBackGroundColor;
            $(thisTable).find("tr").bind("mouseover", function () {
                originalBackGroundColor = $(this).find('td').css('backgroundColor');
                $(this).find('td').css('backgroundColor', opts.overColor);
            });
            $(thisTable).find("tr").bind("mouseout", function () {
                $(this).find('td').css('backgroundColor', originalBackGroundColor);
            });
        });
    };

    $.fn.effectRow.defaults = {
        oddColor: '#C4E1FF',
        evenColor: '#F2F9FD',
        overColor: '#C7C7E2',
        selColor: '#336666'
    };



    /*2.此"静态"方法将会在页面上的所有table上产生效果*/
    $.extend({
        effectRow: function (options) {
            var opts = $.extend({}, $.fn.effectRow.defaults, options);
            $.fn.effectRow.options = opts;

            //奇偶异色
            $('tr:odd > td').css('backgroundColor', opts.oddColor);
            $('tr:even > td').css('backgroundColor', opts.evenColor);

            //MouseOver
            var originalBackGroundColor;
            $("tr").mouseover(function () {
                originalBackGroundColor = $(this).find('td').css('backgroundColor');
                $(this).find('td').css('backgroundColor', opts.overColor);
            });

            //MouseOut
            $("tr").mouseout(function () {
                $(this).find('td').css('backgroundColor', originalBackGroundColor);
            });
        }
    });
})(jQuery);